<template>
	<div>
		<div class="bg-white p-[40px]">
			<el-row>
				<el-col :span="6">
					<div class="main-color v-flex-col">
						<span>标题：</span>
						<el-input v-model="paramster.title" class="flex-1 mt-[10px]" placeholder="请输入"></el-input>
					</div>
				</el-col>
			</el-row>
			<el-row class="mt-[30px] main-color">
				<el-col :span="6">
					<div class="v-flex-col">
						<span class="mb-[10px]">发送目标：</span>
						<el-select v-model="paramster.target" placeholder="请选择">
							<el-option v-for="item in options" :key="item.value" :label="item.label"
								:value="item.value">
							</el-option>
						</el-select>
					</div>
				</el-col>
			</el-row>
			<el-row class="mt-[30px] main-color">
				<el-col :span="21">
					<div class="v-flex-col">
						<span class="mb-[10px]">详情：</span>
						<editor v-model="paramster.content" :height="667" />
					</div>
				</el-col>
			</el-row>
		</div>
		<el-button class="w-[100px] h-[36px] mt-[30px]" color="#0054A6" type="primary" @click="clickSave">保存</el-button>
	</div>
</template>

<script lang="ts" setup>
	import { getRoutePath } from '@/router'
	import { getTarget , publish} from '@/api/basicSettings'
	import feedback from '@/utils/feedback'
	const paramster = reactive({
		title: '',//标题
		content: '',//详情
		target: ''//发送目标
	})
	const options = ref<Array<any>>([])//发送目标
	// 获取发送目标列表
	const target = async () => {
		await getTarget().then(res => {
			for (let i in res) {
				var obj = {
					value: i,
					label: res[i]
				}
				options.value.push(obj)
			}
		})
	}
	target()
	// 保存
	const clickSave = async () => {
		console.log(paramster)
		if(paramster.title == ''){
			return feedback.msgError('请输入标题')
		}
		if(paramster.target == ''){
			return feedback.msgError('请选择发送目标')
		}
		if(paramster.content == ''){
			return feedback.msgError('请输入详情')
		}
		await publish(paramster).then(res=>{
			feedback.msgSuccess('操作成功')
		})
	}
</script>

<style>
</style>